@if $use-grid == true {
  //------------------------------------
  //  GRID
  //------------------------------------
  .row {
    width: 100%;
    
    &:after {
      clear: both;
      content: " ";
      display: table;
    }
  }

  [class*='#{$column-prefix}'] {
    @include vendor(background-clip, padding-box !important);
    
    &.right { float: right; }
    
    img { max-width: 100%; }
  }

  @include breakpoint(small) {
    [class*='#{$column-prefix}'] { float: left; }
    
    .gutters [class*='#{$column-prefix}'] {
      margin-left: $gutters;
      
      &:first-child { margin-left: 0; }
    }
    
    
    // Row columns    
    @include grid-setup();
    
    
    // Push
    
    // Thanks to inuitcss (https://github.com/csswizardry/inuit.css) for the idea to
    // abstract 'push' and 'pull' into their own mixins. This makes adding/removing
    // them to projects absolutely painless. 
    @if $use-push == true {
      [class*='push-'] { position: relative; }
      
      @include push-setup(); 
    }
    
    
    // Pull
    @if $use-pull == true {
      [class*='pull-'] { position: relative; }
      
      @include pull-setup();
    }
  }


  // Non-responsive grid
  .non-responsive {
    [class*='#{$column-prefix}'] {
      float: left;
      width: auto !important; 
    }
    
    .gutters [class*='#{$column-prefix}'], 
    &.gutters [class*='#{$column-prefix}'] { margin-left: $gutters; }
    
    .gutters [class*='#{$column-prefix}']:first-child, 
    &.gutters [class*='#{$column-prefix}']:first-child { margin-left: 0; }
  }
}
